import {
    FooterToolbar,
    PageContainer,
    ProForm,
    ProFormDateRangePicker,
    ProFormDigit, ProFormSelect,
    ProFormText,
    ProFormTextArea,
    ProFormUploadButton,
} from '@ant-design/pro-components';
import { Button, message } from 'antd';
import { ArrowLeftOutlined } from '@ant-design/icons'
import { useNavigate } from 'react-router-dom';
import { addGoods } from '../../../api/Goods';
import {ArrowRightOutlined } from '@ant-design/icons'

export default () => {
    const navigate = useNavigate()
    return (
        <>
            <Button icon={<ArrowLeftOutlined></ArrowLeftOutlined>} style={{ border: 0 }} onClick={() => { navigate('/WorkSpace/GoodsList') }}></Button>
            <Button icon={<ArrowRightOutlined></ArrowRightOutlined>} style={{ border: 0}} onClick={() => { navigate('/WorkSpace/Modifygoodsdaohang') }}></Button>
            <PageContainer>
                <ProForm
                    submitter={{
                        render: (_, dom) => <FooterToolbar>{dom}</FooterToolbar>,
                    }}
                    onFinish={(values) => {
                        addGoods(values).then(res => {
                            message.info('添加成功')
                            navigate('/WorkSpace/GoodsList')
                        })
                    }}
                >
                    <ProForm.Group>
                        <ProFormText
                            name="product_details_id"
                            label="商品详情id"
                            tooltip="提示"
                            placeholder="请输入id"
                            rules={[{ required: true }]}
                        />
                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormText
                            name="product_name"
                            label="商品名称"
                            tooltip="最长为 20 位"
                            placeholder="请输入名称"
                            rules={[{ required: true }]}
                        />
                        <ProFormText
                            width="md"
                            name="product_picture"
                            label="商品头图"
                            placeholder="图片地址"
                        />
                    </ProForm.Group>

                    <ProForm.Group>
                        <ProFormTextArea
                            width="xl"
                            name={['description']}
                            label="商品文字描述"
                            placeholder="请输入详细文字描述，最大不超过100字"
                            rules={[{ required: true }]}
                        />
                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormSelect
                            options={[{
                                value: 'type1',
                                label: '1类商品',
                            },
                            {
                                value: 'type2',
                                label: '2类商品',
                            },
                            {
                                value: 'type3',
                                label: '3类商品',
                            },

                            ]}
                            width="xs"
                            name="product_type"
                            label="商品类型"
                        />
                    </ProForm.Group>
                    <ProFormUploadButton
                        name="文档"
                        label="商品详情描述文档上传"
                        extra="支持扩展名：.jpg .zip .doc .wps" />
                    <ProForm.Group>
                        <ProFormText
                            name="supplier_name"
                            label="供应商名称"
                            tooltip="最长为 20 位"
                            placeholder="请输入名称"
                            rules={[{ required: true }]}
                        />
                        <ProFormText
                            width="md"
                            name="supplier_phone"
                            label="供应商联系方式"
                            placeholder="请输入供应商联系方式"
                            rules={[{ required: true }]}
                        />
                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormText
                            name={['service_guarantee', 'name']}
                            label="服务保障"
                            placeholder="请输入服务保障"
                            rules={[{ required: true }]}
                        />

                    </ProForm.Group>
                    <ProFormSelect
                        width="xs"
                        name="select"
                        label="黄金会员价格类型"
                        valueEnum={{
                            chunjifen: '纯积分',
                            jifenjiaqian: '积分加钱',
                            xianjingoumai: '现金购买',
                        }}
                        placeholder="购买方式"
                        rules={[{ required: true }]}
                    />
                    <ProForm.Group>
                        <ProFormText
                            name="pptIntegral"
                            label="积分数量"
                            tooltip="最长为 20 位"
                            placeholder="请输入数量"
                        />
                        <ProFormText
                            width="md"
                            name="pptMoney"
                            label="现金价格"
                            placeholder="请输入价格"
                        />
                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormDateRangePicker
                            name={['contract', 'createTime']}
                            label="商品投放时间"
                        />
                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormSelect
                            options={[{
                                value: 'zhengzhou',
                                label: '郑州',
                            },
                            {
                                value: 'changsha',
                                label: '长沙',
                            },

                            ]}
                            width="xs"
                            name="productType-a"
                            label="投放城市"
                        />

                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormDigit
                            width="xs"
                            name="stock"
                            label="兑换上限"
                            tooltip="请勿超过库存上限"
                        />
                        <ProFormDigit
                            width="xs"
                            name="stock"
                            label="库存上限"
                        />
                    </ProForm.Group>
                    <ProForm.Group>
                        <ProFormDigit
                            width="sm"
                            name="stock"
                            label="代理人"
                           
                        />
                        
                    </ProForm.Group>
                </ProForm>
            </PageContainer>
        </>
    );
};